<template>
    <div class="dialog">
        <div class="inner-con">
            <span @click="$emit('close')">x</span>
            <h2>{{obj.title}}</h2>
            <p>{{obj.product}}</p>
            <div class="count-wrap">
                <span>价格:{{obj.price}}</span>
                <div>
                    <div v-show="obj.num">
                        <span @click="count('-')">-</span>
                        <span>{{obj.num}}</span>
                    </div>
                    <span @click="count('+')">+</span>
                </div>
            </div>
            <div class="btns">
                <button @click="$router.push('/main/car')">充赠</button>
                <button @click="$router.push('/main/car')">加入购物车</button>
            </div>
        </div>
    </div>
</template>

<script>
export default {
    props:['obj'],
    methods:{
        count(str){
            let num;
            if(str === '+'){
                num = this.obj.num + 1;
            }else{
                num = this.obj.num - 1;
            }
            this.$emit('count',num,this.obj.id);
        }
    }
}
</script>

<style lang="scss">
    .dialog{
        width:100%;
        height: 100%;
        position: absolute;
        top:0;
        left:0;
        background: rgba(0,0,0,.6);
        .inner-con{
            width:80%;
            background: #fff;
            position: absolute;
            top:50%;
            left:50%;
            transform: translate(-50%,-50%);
        }
    }
</style>

